#help-container
  position: absolute
  top: 0px
  left: 0px
  right: 0px
  bottom: 0px

  #help
    position: relative
    max-width: 650px
    min-height: 100%
    margin: 0px auto

    .sidebar-container
      position: fixed
      width: 180px
      height: 100%
      padding-left: 20px

      ul.help-menu
        height: 100%
        margin: 0
        padding: 0
        text-transform: uppercase
        list-style: none

      ul li.heading
        padding: 40px 0 10px 20px
        color: #C4C4C4
        font-weight: bold
        font-size: 14px
        line-height: 20px

      ul li a
        width: 100%
        display: inline-block
        text-decoration: none
        color: #3d699e
        font-size: 12px
        font-weight: bold
        padding: 10px 20px
        text-shadow: 0 1px 0 #FFF

      ul li a.active
        box-shadow: inset 4px 0px 0 #BDC3C7

    .help-content
      height: 100%
      max-width: 500px
      min-width: 350px
      margin-left: 180px
      margin-right: auto
      padding: 40px 25px

      .heading
        position: relative
        margin: 0px
        margin-bottom: 30px

    .heading .circle
      position: absolute
      display: none
      left: -26px
      top: -4px
      overflow: hidden
      color: #FFF
      width: 20px
      text-align: center
      font-size: 20px

    .heading .circle i
      color: #7F8C8D

    .heading h1
      margin: 0
      font-size: 14px
      line-height: 20px
      text-transform: uppercase

    .btn
      font-weight: 600
      letter-spacing: 0.04em
      padding: 5px 10px

    .btn,
    input,
    textarea,
    select,
    #button
      border-radius: 2px

    input[type="submit"].btn
      font-weight: normal

    label
      margin-bottom: 10px

    form
      max-width: 350px

@import './responsive'
